import React from "react";

const Icon = ({ className, isFilled = false, icon, size = "24" }) => {
  const iconStyle = {
    lineHeight: `calc(${size}rem / 16)`,
    width: `calc(${size}rem / 16)`,
    fontSize: `calc(${size}rem / 16)`,
  };
  if (isFilled === true) {
    return (
      <span
        style={iconStyle}
        className={`material-symbols filled ${className}`}
      >
        {icon}
      </span>
    );
  } else {
    return (
      <span style={iconStyle} className={`material-symbols ${className}`}>
        {icon}
      </span>
    );
  }
};

export default Icon;
